﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>待审批日志</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="css/ydui.css?v=1.1.7" rel="stylesheet" />
    <script src="js/ydui.flexible.js"></script>
    <link rel="stylesheet" type="text/css" href="css/mui.picker.min.css" />
    <link rel="stylesheet" type="text/css" href="css/all.css?v=2018041801" />

    <style type="text/css">
        .mui-btn {
            border: none;
        }

        .mui-btn-blue {
            color: #1c94ec;
        }

        .mui-dtpicker-title {
            color: #2A2A2A;
        }

        .mui-picker {
            background: #F5F5F5;
        }

        .classify-title {
            float: left;
            width: 30%;
            font-size: .28rem;
            margin: 0 !important;
            text-align: center;
            position: relative;
        }

            .classify-title:after {
                content: '';
                position: absolute;
                z-index: 0;
                bottom: 0;
                right: 0;
                width: 1px;
                height: 100%;
                border-right: 1px solid #D9D9D9;
                -webkit-transform: scaleX(0.5);
                transform: scaleX(0.5);
                -webkit-transform-origin: 100% 0;
                transform-origin: 100% 0;
            }

            .classify-title span {
                font-size: .24rem;
                margin-left: .15rem;
            }
    </style>
</head>
<body ms-controller="gzrzview" class="ms-controller">
    <div class="g-flexview">
        <div class="title" style="height:100px;background: #44A9FF url(/View_Mobile/UI/GZRZ/images/bg-account.jpg) 100% 100%;">
            <div style="color: #fff;margin-top: 40px;font-size: .4rem; margin-left: 20px; ">
                待审批日志
            </div>
        </div>
        <div class="classify-input" style="padding: .2rem .15rem;">
            <div style="background: #fff;" class="clearfix">
                <input type="text" class="iconfont" placeholder="&#xe6cb;输入搜索内容" id="" style="width:70%;border-radius: 0;" />
            </div>
        </div>
        <div class="g-scrollview">
            <div class="waitrecordlist" >
                <div class="list-box clearfix" ms-repeat-el="ListData">
                    <div class="box-btn">
                        <label class="cell-right" style="padding-right:.34rem; font-size:18px;">
                            {{$index+1}}
                        </label>
                    </div>
                    <div class="box-text">
                        <p class="list-title">{{el.taskName}}<span class="fr">{{el.billingHours}}</span></p>
                        <p class="info">{{el.billingHoursDesc}}</p>
                    </div>
                </div>

            </div>
        </div>
        <div class="m-actionsheet" id="J_ActionSheet">
            <a href="#" class="actionsheet-item">示例菜单 - Data API</a>
            <a href="#" class="actionsheet-item">示例菜单 - Data API</a>
            <a href="#" class="actionsheet-item">示例菜单 - Data API</a>
            <a href="#" class="actionsheet-item">示例菜单 - Data API</a>
            <a href="javascript:;" class="actionsheet-action" id="cancel">取消</a>
        </div>
    </div>

    <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
    <script src="js/ydui.js"></script>
    <script src="/View_Mobile/JS/avalon1.47.js"></script>
    <script src="/View_Mobile/JS/ComFunJS.js?jsver=20160425"></script>
    <script>
        //!function ($) {
        //    var $myAs = $('#J_ActionSheet');
        //    $('.classify-title').on('click', function () {
        //        $myAs.actionSheet('open');
        //    });
        //    $myAs.on('open.ydui.actionsheet', function () {
        //        console.log('打开了');
        //    }).on('close.ydui.actionsheet', function () {
        //        console.log('关闭了');
        //    });
        //}(jQuery);

        var model = avalon.define({
            $id: "gzrzview",
            ListData: [],
            pageindex: 1,
            total: 0,
            status: "",
            GetListData: function (callback) {
                $.getJSON("/API/VIEWAPI.ashx?action=OUTAPI_GETMYLOGBYUDS", { "p": model.pageindex, "pagecount": 10 }, function (r) {
                    if (r.ErrorMsg == "") {
                        var r2 = JSON.parse(r.Result);
                        typeof callback == 'function' && callback.call(this, JSON.parse(r2.Result));
                    }
                })
            },
            Query: function (s) {
                model.status = s;
                init();

            }
        })
        avalon.ready(function () {
            init();

        })

        function init() {
            model.ListData.clear();
            model.pageindex = 1;

            $('.waitrecordlist').infiniteScroll({
                binder: '.g-scrollview',
                pageSize: 10,
                initLoad: true,
                backposition: true,
                jumpLink: '.J_Link',
                loadingHtml: '<img src="http://static.ydcss.com/uploads/ydui/loading/loading10.svg"/>',
                loadListFn: function () {
                    var def = $.Deferred();

                    model.GetListData(function (listArr) {
                        listArr.forEach(function (val) {
                            model.ListData.push(val);
                        });
                        //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });

                        def.resolve(listArr, model.pageindex);
                        model.pageindex++;
                    })

                    return def.promise();
                },
                loadStorageListFn: function (ret, retPage) {
                    var def = $.Deferred();
                    model.pageindex = retPage;
                    ret.forEach(function (listArr) {
                        listArr.list.forEach(function (val) {
                            model.ListData.push(val);
                        });
                    });
                    model.total = model.ListData.length;
                    //$('.m-list').find('img').lazyLoad({ binder: '.g-scrollview' });
                    def.resolve();
                    return def.promise();
                }
            })

        }

    </script>
</body>
</html>
